<!--
 * @Descripttion: 
 * @version: 1.0.0
 * @Author: guoxiaomin
 * @Email: 1093556028@qq.com
 * @Date: 2019-08-20 10:38:02
 * @LastEditors: guoxiaomin
 * @LastEditTime: 2019-09-11 12:46:30
 -->
<style lang="less">
  .pointer{
    cursor: pointer;
  }
  .bounce-enter-active {
    animation: bounce-in .5s;
  }
  .bounce-leave-active {
    animation: bounce-in .5s reverse;
  }
  @keyframes bounce-in {
    0% {
      transform: scale(0);
      left: 7.5rem;
    }
    100% {
      transform: scale(1);
      left: 0;
    }
  }
</style>
<template>
  <div id="app">
    <!-- <transition name="bounce">
      <NavPanel v-if="isOpenedPanel" @linked="linkedClicked" @close='closeNav'></NavPanel>
    </transition> -->
    <Nav v-if="!isMobile"></Nav>
    <router-view/>
    <!-- <MobileFooter></MobileFooter> -->
    <Footer v-if="!isMobile"></Footer>
  </div>
</template>
<script>
import Nav from './components/nav'
import Footer from './components/footer';
// import NavPanel from './components/mobileNavPanel'
// import MobileFooter from './components/mobileFooter'
import {isMobile} from '@common/tool'
export default {
  data() {
    return {
      isOpenedPanel: false,
      isMobile: isMobile()
    }
  },
  components: {
    Nav,
    Footer
    // MobileFooter
  }
  // methods: {
  //   openNavClicked() {
  //     this.isOpenedPanel = true
  //   },
  //   linkedClicked(link) {
  //     this.isOpenedPanel = false
  //     this.$router.replace({
  //       path: link
  //     })
  //   },
  //   closeNav() {
  //     this.isOpenedPanel = false
  //   }
  // }
}
</script>
